//当前选中tab栏id
let tabIndex = ''
let pageSize=6
$(function () {
    let navList = $('.tab_bar').children();
    tabIndex=$(navList[0]).data("id")

    Pagination.init();//分页器
    let {total,currentPage}=Pagination.pagination;

    //一开始进来就请求
    // getData(tabIndex,currentPage,total)

    for(let i=0,len=navList.length;i<len;i++){
        $(navList[i]).bind('click',function(e){
            $(this).addClass('tab_bar_hover').siblings().removeClass('tab_bar_hover');
            // e.stopPropagation();    //  阻止事件冒泡
            tabIndex=$(this).data("id")
            getData(tabIndex,currentPage,pageSize)
            Pagination.pagination.currentPage=1
            Pagination.initPagination()
        })
    }
})
function getData(id,page,size){
    $(".news_list").empty()
    $.get("/list_ajax?id="+id+"&page="+page+"&size="+size, function({data,total}){
        //分页数
        Pagination.pagination.total=Math.ceil(total/pageSize);
        // console.log(Pagination,data,total);
        Pagination.initPagination()
        let nodes = ''
        data.forEach(e=>{
            nodes+=`<div class="news_item cur-p">
            <a href="/lists/show/${e.id}">
                <img src="${e.image}">
                <h4 class="title">${e.title}</h4>
                <p class="onelist-hidden">${e.createtime}</p>
            </a>
          
      </div>`
        })
        $(".news_list").append(nodes);
        checkHeight();
    });
}
var Pagination = {
    pagination: {
        currentPage: 1,
        total: 0,
    },
    paginationTemplate: $("#pagination").html(),
    init: function () {//初始化
        this.fetchHistory();
    },
    fetchHistory: function () {
        // this.pagination.total = 9;
        this.initPagination();
        let {total,currentPage}=this.pagination;
        getData(tabIndex,currentPage,pageSize)
    },
    initPagination: function () {
        // console.log(11111111111111)
        var element = document.getElementById("pagination");
        $("#pagination").html("");
        var fragment = document.createDocumentFragment();
        let {total,currentPage}=this.pagination;
        // console.log("totaltotaltotaltotaltotaltotaltotaltotal:"+total)
        if (total > 1) {//有分页
            if (total > 5) {//分页数大于5页
                var li = this.getPaginationTemplate("<")
                fragment.appendChild(li);
                if (currentPage <= 5) {//当前选中页小于等于5
                    for (let i = 1; i <= 5; i++) {
                        var li = this.getPaginationTemplate(i)
                        fragment.appendChild(li);
                        if (i === currentPage) {
                            li.setAttribute("class", 'pagination pagination-active')
                        }
                    }
                } else {
                    // console.log(currentPage)
                    var li = this.getPaginationTemplate("moreStart");
                    fragment.appendChild(li);
                    for (let i = currentPage - 2; i <= currentPage + 2 && i < total; i++) {
                        var li = this.getPaginationTemplate(i)
                        fragment.appendChild(li);
                        if (i === currentPage) {
                            li.setAttribute("class", 'pagination pagination-active')
                        }
                    }
                }
                if (currentPage === 1 || currentPage + 3 !== total && currentPage + 2 !== total && currentPage + 1 !== total && currentPage !== total) {
                    var li = this.getPaginationTemplate("moreEnd")
                    fragment.appendChild(li);
                    var li = this.getPaginationTemplate(total)
                    fragment.appendChild(li);
                } else {
                    var li = this.getPaginationTemplate(total)
                    if (currentPage === total) {
                        li.setAttribute("class", 'pagination pagination-active')
                    }
                    fragment.appendChild(li);
                }
                var li = this.getPaginationTemplate(">");
                fragment.appendChild(li);
            } else {

                for (let i = 1; i <= total; i++) {
                    var li = this.getPaginationTemplate(i)
                    fragment.appendChild(li);
                    if (i === currentPage) {
                        li.setAttribute("class", 'pagination pagination-active')
                    }
                }
            }
            element.appendChild(fragment);
        }
    },
    getPaginationTemplate: function (index) {
        var li = document.createElement('a');
        li.setAttribute("class", 'pagination')
        if (index === "moreStart" || index === "moreEnd"||index=='<'||index=='>') {
            li.text = "";
            li.setAttribute("class", `pagination iconfont icon-arrow-${index=='<'?'left':(index=='>'?'right':'dian')}`)
        }else {
            li.text = index;
        }
        // console.log(index)
        li.id = `pagination${index}`;
        li.onclick = function (event) {
            this.changePagination(index)
            this.fetchHistory()
        }.bind(this);
        li.setAttribute("href", 'javascript:void(0)')
        return li;
    },
    changePagination: function (index) {
        if (index === "<" && this.pagination.currentPage !== 1) {
            this.pagination.currentPage -= 1;
        } else if (index === ">" && this.pagination.currentPage !== this.pagination.total) {
            this.pagination.currentPage += 1;
        } else if (index === "moreStart") {
            if (this.pagination.currentPage - 3 > 1) {
                this.pagination.currentPage -= 3;
            }
        } else if (index === "moreEnd") {
            if (this.pagination.currentPage + 3 < this.pagination.total) {
                if (this.pagination.currentPage === 1) {
                    this.pagination.currentPage = 6;
                } else {
                    this.pagination.currentPage += 3;
                }
            }
        } else if (parseInt(index)) {
            this.pagination.currentPage = index;
        }
        this.initPagination();
    }
}